<template>
  <input type="text" v-model="hello">
  <h3>{{ hello }}</h3>
</template>

<script>
import {customRef} from "vue";

export default {
  name: 'App',
  setup() {
    //自定义ref可以写一些逻辑在里面
    function myRef(value) {
      return customRef((track, trigger) => {
        //返回一个函数
        return {
          get() {
            track(); //被调用时更新模板
            return value;
          },
          set(newValue) {
            value = newValue;
            trigger(); //数值改变的时候调用get()
          }
        }
      })
    }
    let hello = myRef('hello');
    return {
      hello
    }
  }
}
</script>

<style>

</style>
